<template>
  <div class="header">
    <div class="headertop">
      <div class="hdtopall">
        <div class="hdtopleft">切换到融资中心</div>
        <div class="hdtopright">15585589941 退出</div>
      </div>
    </div>
    <div class="headerbtn">
      <div class="logo"><img class="logoimg" src="../../assets/img/logo.png" alt=""></div>
      <div class="nav">
        <ul class="navul">
          <li v-for="item of navList" :key="item.id"><router-link  :id="item.id" :class="{active:item.id == tagcolo.nav}" :to="item.to">{{item.text}}</router-link></li>
        </ul>
      </div>
      <div class="myhome">
        <div class="userCenter-portal">
          <i></i>
          <a href="javascript:;" class="userCenter-portal-text" id="wdzc">我的资产</a>
          <span>&gt;</span>
        </div>
      </div>
    </div>

  </div>
</template>

<script>
export default {
  name: '',
  data () {
    return {
      active: false,
      navList: [
        {text: '首页', active: true, to: '/', id: 'home'},
        {text: '银行间产品', active: false, to: '/product', id: 'product'},
        {text: '委托债权', active: false, to: '/', id: 'entrust'},
        {text: '权益类资产', active: false, to: '/assets', id: 'assets'},
        {text: '网上路演', active: false, to: '/', id: 'online'}
      ]
    }
  },
  props: {
    tagcolo: Object
  },
  methods: {
  }
}
</script>

<style scoped type="text/stylus" lang="stylus">
  .header
    width: 100% ;height:100px;border-bottom:1px solid #ccc
    .headertop
      width:100% ;height:30px ;background-color:#f9f9f9
      .hdtopall
        width:1200px ;margin:0 auto ;line-height:30px ;color:#a9a9a9
        .hdtopleft
          float:left
        .hdtopright
          float:right
     .headerbtn
       height:70px ;width:1200px ;margin:0 auto
      .logo,.nav
        float:left ;height:70px
      .myhome
        float:right ;height:70px
      .logo
        width:200px ;height:70px
        .logoimg
          width:198px ;height:38px ;margin-top:18px
      .nav
        width:740px
        .navul
          margin:18px 0 0 70px;
          li
            float:left ;margin-right:20px ;padding:10px
            .active
              color:#BA9959
            a
              font-size:20px ;display:block ;color:#474e5d

      .myhome
        width:120px;
        .userCenter-portal
          margin-top:18px;
          width: 120px;
          padding-left: 0px;
          height: 34px;
          line-height: 34px;
          background-color: #f9f9f9;
          border: 1px solid #e6e6e6;
          border-radius: 3px;
          position: relative;
          i
            background: url(../../assets/img/data.png);
            width: 14px;
            height: 14px;
            display: block;
            position: absolute;
            top: 12px;
            left: 10px;
          #wdzc
            padding-left:30px
          .userCenter-portal-text
            font-size: 14px;
            font-style: normal;
            color: #5e5e5e;
          span
            font-size:19px

</style>
